<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>MdiWin Demo - edit</title>
    <uieip type="file" value="inc" src="/yqwin/easyui/include.txt" cache="true" minute="1440"></uieip>
    <uieip type="file" value="css" src="/yqwin/css/yqwin.min" cache="false"></uieip>
    <uieip type="file" value="js" src="/yqwin/data/yqwin.min" cache="false"></uieip>

    <!-- 引入结束 -->
    <style>
        body {
            margin: 10px;
        }

        table {
            border-spacing: 0px;
        }
    </style>
</head>

<body>
    <h2>901 yqTextTitles</h2>
    <input id="tb" type="text" style="width:300px" />
    <p></p>
    <a href="#" class="easyui-linkbutton" data-options="" onclick="javascript:isedit2(true)">enable</a>
    <a href="#" class="easyui-linkbutton" data-options="" onclick="javascript:isedit2(false)">disable</a>

    <h2>901 yqTitlesEdit</h2>
    <div id="div_titles">
    </div>
    <p></p>
    <a href="#" class="easyui-linkbutton" data-options="" onclick="javascript:getValue()">getValue</a>
    <a href="#" class="easyui-linkbutton" data-options="" onclick="javascript:dataClear()">clear</a>
    <a href="#" class="easyui-linkbutton" data-options="" onclick="javascript:setValue()">setValue</a>
    <input id="txt_width" value="800"></input>
    <input id="txt_height" value="400"></input>
    <a href="#" class="easyui-linkbutton" data-options="" onclick="javascript:reset()">reset</a>
    <a href="#" class="easyui-linkbutton" data-options="" onclick="javascript:destroy()">destroy</a>
    <a href="#" class="easyui-linkbutton" data-options="" onclick="javascript:isedit(true)">enable</a>
    <a href="#" class="easyui-linkbutton" data-options="" onclick="javascript:isedit(false)">disable</a>
    <script>
        $(function () {
            $("#div_titles").yqTitlesEdit({
                width: 900,
                height: 700,
                value: param
            });

            //----------------------------------
            $("#txt_width").numberspinner({
                width: 90,
                min: 100,
                max: 1000,
                label: "w",
                labelWidth: 18,
            })

            $("#txt_height").numberspinner({
                width: 130,
                min: 100,
                max: 1000,
                label: "h",
                labelWidth: 15,
                buttonText: "resize",
                onClickButton: function () {
                    $("#div_titles").yqTitlesEdit("resize",
                        {
                            width: $("#txt_width").numberspinner("getValue"),
                            height: $("#txt_height").numberspinner("getValue")
                        });
                },
            })
            //----------------------------------
            $("#tb").yqTextTitles({
                value: param
            });
        });

        var old_value = {};
        function getValue() {
            old_value = $("#div_titles").yqTitlesEdit("getValue");
            console.log(old_value);
        }

        function dataClear() {
            $("#div_titles").yqTitlesEdit("clear");
        };

        function setValue() {
            $("#div_titles").yqTitlesEdit("setValue", old_value);
        }

        function reset() {
            $("#div_titles").yqTitlesEdit({
                value: old_value
            });
        }

        function destroy() {
            $("#div_titles").yqTitlesEdit("destroy");
        }

        function isedit(tf) {
            $("#div_titles").yqTitlesEdit("isEdit", tf);
        }

        function isedit2(tf) {
            $("#tb").yqTextTitles("isEdit", tf);
        }

        var param = {
            titles: [{
                name: "code",
                ui_title: "Code",
                ui_type: 1,
                ui_width: 80,
                ui_visible: true,
                ui_mask: {
                    default: "1"
                }
            }, {
                name: "name",
                ui_title: "Name",
                ui_type: 2,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            }, {
                name: "checkbox",
                ui_title: "Checkbox",
                ui_type: 3,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            }, {
                name: "dateTimePicker",
                ui_title: "DateTimePicker",
                ui_type: 4,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            }, {
                name: "richTextBox",
                ui_title: "RichTextBox",
                ui_type: 5,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            }, {
                name: "comboBox",
                ui_title: "ComboBox",
                ui_type: 6,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            }, {
                name: "treeSelect",
                ui_title: "TreeSelect",
                ui_type: 8,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            }, {
                name: "numberBox",
                ui_title: "NumberBox",
                ui_type: 9,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            }, {
                name: "NumberSpinner",
                ui_title: "NumberSpinner",
                ui_type: 10,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            }, {
                name: "TimeSpinner",
                ui_title: "TimeSpinner",
                ui_type: 11,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            }, {
                name: "DateTimeBox",
                ui_title: "DateTimeBox",
                ui_type: 12,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            }, {
                name: "NCheckBox",
                ui_title: "NCheckBox",
                ui_type: 13,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            },
            {
                name: "attr",
                ui_title: "Attr",
                ui_type: 17,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {
                    param: {
                        titles: [{
                            name: "code",
                            ui_title: "Code",
                            ui_type: 2,
                            ui_width: 80,
                            ui_visible: true,
                            ui_readonly: false,
                            ui_mask: {}
                        }, {
                            name: "name",
                            ui_title: "Name",
                            ui_type: 2,
                            ui_width: 80,
                            ui_visible: true,
                            ui_readonly: false,
                            ui_mask: {}
                        }, {
                            name: "attr",
                            ui_title: "Attr",
                            ui_type: 17,
                            ui_width: 80,
                            ui_visible: true,
                            ui_readonly: false,
                            ui_mask: {
                                titles: {
                                    titles: [{
                                        name: "code",
                                        ui_title: "Code",
                                        ui_type: 2,
                                        ui_width: 80,
                                        ui_visible: true,
                                        ui_readonly: false,
                                        ui_mask: {}
                                    }, {
                                        name: "name",
                                        ui_title: "Name",
                                        ui_type: 2,
                                        ui_width: 80,
                                        ui_visible: true,
                                        ui_readonly: false,
                                        ui_mask: {}
                                    }]
                                }
                            }
                        }],
                        model: [{
                            describe: "Html模板",
                            model: "<table _n=\"_tb\"></table>",
                            type: 2,
                            no: "1"
                        },]
                    }
                }
            }, {
                name: "table",
                ui_title: "Table",
                ui_type: 15,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {
                    param: {
                        titles: [{
                            name: "code",
                            ui_title: "Code",
                            ui_type: 2,
                            ui_width: 80,
                            ui_visible: true,
                            ui_readonly: false,
                            ui_mask: {}
                        }, {
                            name: "name",
                            ui_title: "Name",
                            ui_type: 2,
                            ui_width: 80,
                            ui_visible: true,
                            ui_readonly: false,
                            ui_mask: {}
                        }]
                    }
                }
            }, {
                name: "tree",
                ui_title: "Tree",
                ui_type: 16,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {
                    param: {
                        titles: [{
                            name: "code",
                            ui_title: "Code",
                            ui_type: 2,
                            ui_width: 80,
                            ui_visible: true,
                            ui_readonly: false,
                            ui_mask: {}
                        }, {
                            name: "name",
                            ui_title: "Name",
                            ui_type: 2,
                            ui_width: 80,
                            ui_visible: true,
                            ui_readonly: false,
                            ui_mask: {}
                        }]
                    }
                }
            }, {
                name: "File",
                ui_title: "File",
                ui_type: 18,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            }, {
                name: "Html",
                ui_title: "Html",
                ui_type: 19,
                ui_width: 80,
                ui_visible: true,
                ui_readonly: false,
                ui_mask: {}
            },],
            model: []
        }


    </script>
</body>

</html>